import React, { Component } from 'react'
import qs from 'qs'
import { goodsRequest } from '../request/cate_request'
import Header from '../components/DefaultHeader'
import { cartadd } from '../request/cart_request'
export default class GoodsList extends Component {
    state = {
        type_name: "",
        goods_list: []
    }
    UNSAFE_componentWillMount() {
        const { type_id, type_name } = qs.parse(this.props.location.search.substring(1))
        this.setState({ type_name })
        goodsRequest(type_id).then(res => {
            this.setState({ goods_list: res.list })
        })
    }
    componentWillUnmount() {
        this.setState = () => false //重置了setState
    }
    add(goodsid, type = 2) {
        cartadd(goodsid, type, 1).then(res => {

            if (res.code === 200) {
                this.props.getcartlist1()
            }
        })
    }
    render() {
        const { type_name, goods_list } = this.state
        return (
            <div>

                <Header title={type_name} />

                <div className="goodslist">
                    {
                        goods_list.map(item => (
                            <div className="item" key={item.id}>
                                <img onClick={() => this.props.history.push("/goods_detail?id=" + item.id)} src={this.pic_path + item.img} alt="" />
                                <div>
                                    <h5 onClick={() => this.props.history.push("/goods_detail?id=" + item.id)}>{item.goodsname}</h5>
                                    <p className="price">&yen;{item.price}</p>
                                    <p className="market-price">&yen;{item.market_price}</p>
                                    <button className="btn-cart" onClick={() => this.add(item.id, 1)}>加入购物车</button>
                                </div>
                            </div>
                        ))
                    }
                </div>
            </div>
        )
    }
}
